<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <script>
        function doCookie(){
            /**
             * 写入cookie
             */
            // document.cookie = 'name=tom'
            // var date = new Date()
            // date.setDate(date.getDate()+7) 
            // document.cookie = 'address=nanjing;expires=' + date.toUTCString() // 有效期为7天

            /**
             * 读取cookie
             */ 
            console.log(document.cookie)
        }

        function doStorage(){
            /**
             * 写入
             */ 
            // localStorage.setItem('sex', '男')
            // localStorage.setItem('age', 28)

            // localStorage.setItem('sex', '女') // 修改

            // sessionStorage.setItem('hobby', '编程')

            /**
             * 读取
             */ 
            // console.log(localStorage.getItem('sex'))
            // console.log(typeof localStorage.getItem('age'))


            /**
             * 存储对象
             */ 
            // var stu = {
            //     id: 9527,
            //     name: '唐伯虎',
            //     sex: '男'
            // }
            // localStorage.setItem('stu', JSON.stringify(stu))

            var str = localStorage.getItem('stu')
            console.log(str)

            var obj = JSON.parse(str)
            console.log(obj)

        }
    </script>
</head>
<body>
    <input type="button" value="操作cookie" onclick="doCookie()">
    <input type="button" value="操作web storage" onclick="doStorage()">
</body>
</html>